<div class="layuimini-container layuimini-page-anim">
  <div class="layuimini-main">
    <div class="layui-btn-container">
      <button class="layui-btn layui-btn-sm" id="btn-save">保存文件</button>
      <button class="layui-btn layui-btn-sm" id="btn-line-feed">切换换行</button>
    </div>
    <div class="container diffs wrapper" style="height: 77vh;">
      <textarea id="code" name="code"></textarea>
    </div>
  </div>
</div>

<script type="text/javascript">
  $(document).ready(function () {
    var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
      lineNumbers: true,
      lineWrapping: false,
      styleActiveLine: true,
      matchBrackets: true,
      mode: "shell",
      theme: "dracula",
      keyMap: "sublime",
    });
    $.get("./api/config/config", function (data) {
      editor.setValue(data);
    });
    $("#btn-save").click(function () {
        var confContent = editor.getValue();
        $.post('./api/save', { content: confContent, name: "config.sh" }, function (data) {
            layer.msg('保存成功~');
        });
    });
    $("#btn-line-feed").click(function () {
        var lineWrapping = editor.getOption('lineWrapping');
        editor.setOption('lineWrapping', !lineWrapping);
    });
  });
  layui.use(["layer"], function () {
    var $ = layui.jquery,
      layer = layui.layer;
  });
</script>
